/*reset*/
html, body, h1, h2, h3, p, ul, li { margin: 0; padding: 0; }

em { font-style: normal; }

ul, li { list-style: none; }

a, p { font-family: Helvetica, Tahoma, Arial, "Hiragino Sans GB", "Hiragino Sans GB W3", "Microsoft YaHei", STXihei, STHeiti, Heiti, SimSun, sans-serif; }

img { border: none; }

/*useful class*/
.bc { margin: 0 auto; }

.fl { float: left; }

.fr { float: right; }

.clearfix:after { content: " "; display: block; height: 0; clear: both; visibility: hidden; }

.clearfix { *zoom: 1; }

.w960 { width: 960px; }

/*.w852 { width: 852px; }*/

.w852 { width: 811px; }
/*start*/
/*body { min-width: 960px; }*/
body { min-width: 1140px; }

.topTool { float: right; width: 280px; font-size: 0.875em; }

.topTool ul { width: 100%; height: 40px; padding-top: 6px; }

.topTool li { float: right; margin-left: 30px; position: relative; line-height: 40px; }

.topTool li.more { padding-right: 20px; background: transparent url(http://sqimg.qq.com/qq_product_operations/im/update_new/topmore.png) no-repeat right center; }

.topTool .login { height: 43px; line-height: 43px; }

.topTool .login span { padding: 0 18px; color: #cecece; }

.topTool a { text-decoration: none; color: #fff; }

.topTool a:hover { color: #12b7f5; }

.flashData { clear: both; width: 100%; line-height: 17px; text-align: right; letter-spacing: 0.025em; }

.flashData a:hover { text-decoration: underline; }

.morePenel { display: none; position: absolute; right: 0; top: 25px; width: 100px; z-index: 100; }

.morePenel .trg { position: absolute; right: 28px; top: 4px; width: 10px; height: 7px; background: transparent url(http://sqimg.qq.com/qq_product_operations/im/update_new/trg.png) no-repeat 0 0; font-size: 0; }

/* downpanel */
.moredrop { width: 100px; margin-top: 10px; background: #fff; }

.moredrop a { display: block; padding-left: 10px; height: 39px; border-bottom: 1px solid #cfcfcf; line-height: 39px; }

.moredrop a:link { color: #333; }

.moredrop a:visited { color: #333; }

.moredrop a:hover { color: #12b7f5; }

.banner { height: 260px; background: #208ed1 url(http://sqimg.qq.com/qq_product_operations/im/update_new/banner-bg.jpg) center center; background-size: cover; overflow: hidden; }

.banner .content { position: relative; }

.banner .logo { margin-top: 10px; }

.banner .main-title { top: 110px; left: 420px; position: absolute; padding-top: 67px; height: 0; overflow: hidden; width: 424px; background: url("http://sqimg.qq.com/qq_product_operations/im/update_new/main-title.png") left top no-repeat; }

.page { height: 580px; border-bottom: #e8e8e8 1px solid; }

.page .content { position: relative; height: 100%; overflow: hidden; }

.page .title-warp { height: 0; margin-top: 54px; overflow: hidden; background: left top no-repeat;padding-top: 109px; }

.page .left-img { position: absolute; bottom: 0; left: 0; }

.page .right-img { position: absolute; bottom: 0; right: 0; }

.page-1 .title-warp {  padding-top: 109px; width: 261px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/update_new/page3-title.png);}


.page-2 .title-warp {padding-top: 110px; width: 393px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/update_new/page2-title.png);   }
.page-2 img.details-img{bottom: 32px;}

.page-3 .title-warp { padding-top: 109px; width: 393px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/update_new/page1-title.png);}

.page-4 .title-warp { padding-top: 109px; width: 461px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/04txt.png); }
.page-4 img.details-img{bottom: 32px;}

.page-5 .title-warp { padding-top: 109px; width: 385px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/03txt.png);  }
.page-5 img.details-img{bottom: 31px;}

.page-6 .title-warp {padding-top: 110px; width: 426px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/02txt.png); }
.page-6 img.details-img{bottom: 58px;}

.page-7 .title-warp {  padding-top: 109px; width: 463px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/01txt.png);}
.page-7 img.details-img{bottom: 30px;}

.page-8 .title-warp { padding-top: 109px; width: 328px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/06txt.png); }
.page-8 img.details-img{bottom: 34px;}
.page-9 .title-warp {   width: 328px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/05txt.png);}
.page-9 img.details-img{bottom: 35px;}
.page-10 .title-warp {   width: 262px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/10txt.png);}
.page-10 img.details-img{bottom: 104px;}
.page-11 .title-warp {   width: 394px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/11txt.png);}
.page-11 img.details-img{bottom: 61px;}
.page-12 .title-warp {   width: 262px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/12txt.png);}
.page-12 img.details-img{bottom: 42px;}
.page-13 .title-warp {   width: 315px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/13txt.png);}
.page-13 img.details-img{bottom: 58px;}
.page-14 .title-warp {   width: 365px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/14txt.png);}
.page-14 img.details-img{bottom: 75px;}
.page-15 .title-warp {   width: 523px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/15txt.png);}
.page-15 img.details-img{bottom: 93px;}
.page-16 .title-warp {   width: 658px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/16txt.png);}
.page-16 img.details-img{bottom: 88px;right: 100px;}
.page-17 .title-warp {   width: 468px;padding-top: 112px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/17txt.png);}
.page-17 img.details-img{bottom: 49px;}
.page-18 .title-warp {width: 458px;padding-top: 112px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/18txt.png);}
.page-18 img.details-img{bottom: 56px;}
.page-19 .title-warp {   width: 395px;padding-top: 109px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/19txt.png);}
.page-19 img.details-img{bottom: 50px;}
.page-20 .title-warp {   width: 392px;padding-top: 108px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/6.3.5/20txt.png);}
.page-20 img.details-img{bottom: 42px;}
.page-21 .title-warp {   width: 417px;padding-top: 108px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/6.3.5/21txt.png);}
.page-21 img.details-img{bottom: 42px;}
.page-22 .title-warp {   width: 363px;padding-top: 108px; background-image: url(http://sqimg.qq.com/qq_product_operations/im/mobileqq/feature/6.3.5/22txt.png);}
.page-22 img.details-img{bottom: 42px;}


.bottom { border-bottom: #e8e8e8 1px solid; height: 100px; line-height: 100px; text-align: center; background-color: #f0f1f4;cursor: pointer;}

.bottom .more-fun { color: #18b4ed; }

.bottom .more-fun:visited { color: #18b4ed; }

.footer { height: 175px; }

.footer .copyright { padding-top: 65px; line-height: 17px; font-size: 14px; color: #8d92af; }

.footer .copyright p { text-align: center; }

#loginInfo img{ float: left; width:25px; height:25px; margin-top: 5px; vertical-align:middle; border-radius: 12px; cursor: pointer;}
.loginPenel{ display: none; position: absolute; right: 0; top: 30px; width: 120px; height: 85px; z-index: 100;}
.loginPenel .trg{ position: absolute; right: 8px; top: 4px; width: 10px; height: 7px; background:transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/trg.png) no-repeat 0 0; font-size: 0;}
.logindrop{ width: 120px; height: 75px; margin-top: 10px; background: #fff;}
.nick{ width: 100px; height: 39px; overflow: hidden; margin: 0 auto; white-space: nowrap; line-height: 39px; text-align: center; text-overflow:ellipsis;}
.lgout{ width: 100%;  border-top: 1px solid #d7d7d7; line-height: 35px; text-align: center;}
.lgout a:link, .lgout a:visited{ color: #333;}

/* flash */
.flashBar{ float:right; width:67px;}
.flashBar a{ display:block; width:67px; height:0; overflow:hidden; padding-top:67px; background:#000 url(http://im-img.qq.com/home/img/q2013/flahicons.png) no-repeat 0 0; border-bottom:1px solid #333;}
.flashBar a.close{ background-position:14px 14px;}
.flashBar a.sharetozone{ background-position:14px -52px;}
.flashBar a.sharetoweibo{ background-position:14px -120px;}
.flashBar a.close:hover{ background-position:-52px 14px;}
.flashBar a.sharetozone:hover{ background-position:-52px -52px;}
.flashBar a.sharetoweibo:hover{ background-position:-52px -120px;}
.flashBox{ float:left;background:url(http://im-img.qq.com/online/images/loading.gif) no-repeat 50% 40%;width:910px;height:auto;}
.overlay{ display:none; position:absolute; left:0; top:0; z-index:9999; width:100%; height:100%; background-color:#000; opacity:0.6; filter:Alpha(opacity=60);}
#flashDiv{ position:absolute; left:50%; top:47px; width:978px; height:721px; margin:0 0 0 -489px; display:none; z-index:10000; position: fixed;}
.togame{ clear: both; padding-right: 80px; height: 31px; text-align: right;}
.login_div { display: none; position: fixed; left: 50%; top: 50%; width: 622px; height: 368px; margin: -184px 0 0 -311px; z-index: 99999;}

/* menubar */
/*.sideBar{ width: 1000px; height: 1px; position: absolute; top: 0px; left: 50%; margin: 0 0 0 -500px;}*/
/*.menu { background: #fbfbfb; width: 120px; position: absolute; right: -86px; top: 660px;  z-index: 9999;}*/
.sideBar{position: fixed;bottom: 275px; width: 1200px;padding-bottom:160px;left: 50%;margin-left: -600px;}
.menu { background: #fbfbfb; width: 120px; position: absolute;  z-index: 9999;right: -50px;}
.menu li{
    line-height: 30px;
    height: 30px;
    color: gray;
    border-bottom: 1px solid #eaeaea;
}
.menu li a{display: inline-block;width: 100%;color:inherit ;*width:110px;*color: gray; cursor: pointer;text-decoration: none;border: none;outline: none;text-indent: 10px;}
.menu li.selected{background-color:#41c5f6;}
.menu li.selected a{color: #ffffff;}
#morelist li{border: none;}